<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <%@ include file="/include/service-base-header.jsp" %>
    <title>login</title>
</head>

<body class="login-page">
<div class="page-header header-filter"
     style="background-image: url(../image/background-image.jpg); background-size: cover; background-position: top center;">
    <div class="container">
        <div class="row">
            <div class="col-md-4 col-sm-6 ml-auto mr-auto">
                <div class="card card-signup">
                    <form class="form" method="" action="">
                        <div class="card-header card-header-primary text-center" style="padding: 1rem">
                            <h3 class="card-title">GO WIN</h3>
                        </div>
                        <h4 class="description text-center" style="margin-top: 2rem">Agency Center</h4>
                        <div class="card-body">
                            <div class="input-group">
                                <div class="input-group-prepend">
                                        <span class="input-group-text">
                                            <i class="material-icons">face</i>
                                        </span>
                                </div>
                                <input type="text" class="form-control" placeholder="account..." name="phone">
                            </div>
                            <div class="input-group">
                                <div class="input-group-prepend">
                                    <span class="input-group-text">
                                        <i class="material-icons">lock_outline</i>
                                    </span>
                                </div>
                                <input type="password" class="form-control" placeholder="password..." name="password">
                            </div>
                        </div>

                        <div class="card-footer justify-content-center" style="margin-bottom: 0px;">
                            <a onclick="login()" class="btn btn-primary btn-link btn-wd btn-lg"
                               style="font-size: 1rem;padding: 15px 15px 0px 15px;margin-bottom: 0px;">Login</a>
                        </div>
                        <div class="card-footer justify-content-end" style="margin-top: 0px;padding-top: 0px;">
                            <a data-toggle="modal" data-target="#loginModal"
                               style="padding: 0px;color: #999">Change Password</a>
                        </div>

                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<%--修改密码弹框--%>
<div class="modal fade" id="loginModal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Change Password</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="input-group" >
                    <span class="input-group-text">
                        <i class="material-icons">face</i>
                    </span>
                    <input type="text" class="form-control" placeholder="account..." id="user_phone">
                </div>
                <div class="input-group" style="padding: 30px 0px 30px 0px;">
                    <span class="input-group-text">
                        <i class="material-icons">lock_outline</i>
                    </span>
                    <input type="password" class="form-control" placeholder="old password..." id="old_pwd">
                </div>
                <div class="input-group">
                    <span class="input-group-text">
                        <i class="material-icons">lock_outline</i>
                    </span>
                    <input type="password" class="form-control" placeholder="new password..." id="new_pwd">
                </div>
                <div class="input-group" style="padding: 30px 0px 30px 0px;">
                    <span class="input-group-text">
                        <i class="material-icons">lock_outline</i>
                    </span>
                    <input type="text" class="form-control" placeholder="SMS code..." id="sms_code">
                    <button type="button" class="btn btn-link btn-info">Get</button>
                </div>
            </div>
            <div class="modal-footer justify-content-center">
                <button type="button" onclick="changePwd()" class="btn btn-info">Confirm</button>
            </div>
        </div>
    </div>
</div>

<%--修改密码弹框结束--%>

</body>
<script>

    /**
     * 发送验证码
     */
    function sendSMSCode(){
        var user_phone = $('#user_phone').val();
        var old_pwd = $('#old_pwd').val();
        var new_pwd = $('#new_pwd').val();
        var sms_code = $('#sms_code').val();

        if (null == user_phone || user_phone == "") {
            showNotification('bottom', 'right', 'Input account please');
            return;
        }
        if (null == old_pwd || old_pwd == "") {
            showNotification('bottom', 'right', 'Input old password please');
            return;
        }
        if (null == new_pwd || new_pwd == "") {
            showNotification('bottom', 'right', 'Input new password please');
            return;
        }
        if (null == sms_code || sms_code == "") {
            showNotification('bottom', 'right', 'Input SMS code please');
            return;
        }

        $.ajax({
            url: baseUrl.base + "user/sendSMS",
            type: 'POST',
            data: {'phone': user_phone},
            success: function (data) {
                showNotification('bottom', 'right', data.msg);
            }
        });
    }

     /**
     * 修改密码
     */
    function changePwd() {
        var user_phone = $('#user_phone').val();
        var old_pwd = $('#old_pwd').val();
        var new_pwd = $('#new_pwd').val();
        var sms_code = $('#sms_code').val();

        if (null == user_phone || user_phone == "") {
            showNotification('bottom', 'right', 'Input account please');
            return;
        }
        if (null == old_pwd || old_pwd == "") {
            showNotification('bottom', 'right', 'Input old password please');
            return;
        }
        if (null == new_pwd || new_pwd == "") {
            showNotification('bottom', 'right', 'Input new password please');
            return;
        }
        if (null == sms_code || sms_code == "") {
            showNotification('bottom', 'right', 'Input SMS code please');
            return;
        }

        $.ajax({
            url: baseUrl.base + "user/modifyPwd",
            type: 'POST',
            data: {'phone': user_phone, 'oldPwd': old_pwd,'newPwd':new_pwd,'code':sms_code},
            success: function (data) {
                if (data.code == "0") {
                    $("#loginModal").modal('hide');
                }

                showNotification('bottom', 'right', data.msg);
            }
        });
    }

    function login() {
        var phone = $(" input[ name='phone' ] ").val();
        var password = $(" input[ name='password' ] ").val();
        if (null == phone || phone == "") {
            showNotification('bottom', 'right', 'Input account please');
            return;
        }
        if (null == password || password == "") {
            showNotification('bottom', 'right', 'Input password please');
            return;
        }
        $.ajax({
            url: baseUrl.base + "user/login",
            type: 'POST',
            data: {'phone': phone, 'password': password},
            success: function (data) {
                if (data.code == "0") {
                    var res = data.results;
                    $(location).attr('href', '${pageContext.request.contextPath}/s/desk.do');
                } else {
                    var res = data.msg;
                    showNotification('bottom', 'right', res);
                }
            }
        });
    }

    $(document).keypress(function (e) {
        var eCode = e.keyCode ? e.keyCode : e.which ? e.which : e.charCode;
        if (eCode == 13) {
            login();
        }
    });
</script>
</html>